<template>
    <div>
        <table border="1" width="80%">
            <thead>
                <h1>用户管理</h1>
                <tr>
                    <td>姓名</td>
                    <td>年龄</td>
                    <td>性别</td>
                    <td>出生年月</td>
                    <td>地址</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="(item) in xuanr" :key="item.id">
                    <td>{{ item.name }}</td>
                    <td>{{ item.age }}</td>
                    <td>{{ item.sex }}</td>
                    <td>{{ item.ny }}</td>
                    <td>{{ item.dz }}</td>
                    <td>删除</td>
                </tr>
            </tbody>
        </table>
        <fyq :as="Math.ceil(datas.length / ts)" @asd="sf"></fyq>
    </div>
</template>

<script>
export default {
    data() {
        return {
            datas: [{ id: 1, name: "张三", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 2, name: "李四", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 3, name: "王五", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 4, name: "赵丽", age: 20, sex: "女", ny: "2003-1-1", dz: "四川成都" },
            { id: 5, name: "张华", age: 20, sex: "女", ny: "2003-1-1", dz: "四川成都" },
            { id: 6, name: "刘三", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 7, name: "朱红", age: 20, sex: "女", ny: "2003-1-1", dz: "四川成都" },
            { id: 8, name: "王明", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 9, name: "张三", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 10, name: "张三", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" },
            { id: 11, name: "张三", age: 20, sex: "男", ny: "2003-1-1", dz: "四川成都" }],
            xuanr: "",
            ts: 6,
        }
    },
    methods: {
        sf(val) {
            this.xuanr = this.datas.slice((val - 1) * this.ts, val * this.ts)
        }
    }
}
</script>

<style scoped></style>